<template>
	<view>
		<!-- <view class="name">
			<view class="name_left">旧密码</view>
			<input type="password" v-model="oldPassword" placeholder="请输入旧密码" />
		</view>
		<view class="name">
			<view class="name_left">新密码</view>
			<input type="password" v-model="newPassword" placeholder="请输入新密码" />
		</view> -->
		
		<view class="name">
			<view class="name_left">旧密码</view>
			<input class="name_right" :password="showPassword"  type="text" v-model="oldPassword" placeholder="请输入旧密码" />
			
			<view @click="showPwd(0)">
			  <image :src="showPassword == false ?'../../static/images/open.png':'../../static/images/close.png'"
			  style="width:40rpx;height: 40rpx;"></image>
			</view>
		</view>
		<view class="name">
			<view class="name_left">新密码</view>
			<input class="name_right" :password="showPasswordTo" type="text" v-model="newPassword" placeholder="请输入新密码" />
			
			<view @click="showPwd(1)">
			  <image :src="showPasswordTo == false ?'../../static/images/open.png':'../../static/images/close.png'"
			  style="width:40rpx;height: 40rpx;"></image>
			</view>
		</view>
		<button class="loginButton-2" @click="modifyPwd()">提交</button>
	</view>
</template>

<script>
	export default {
		components: {
			
		},
		data() {
			return {
				codenumber:null,
				oldPassword:null,
				newPassword:null,
				
				showPassword: true,
				showPasswordTo:true
			};
		},
		methods: {
			showPwd(e){
				if(e == 0){
					 this.showPassword = !this.showPassword;
				}else if(e == 1){
					this.showPasswordTo = !this.showPasswordTo;
				}
			       
			},
			
			code(){ //验证码定时器
				this.codenumber = 60
				let time = setInterval(function(){
					this.codenumber--
					if(this.codenumber == 0){
						this.codenumber = null
						clearInterval(time)
					}
				}.bind(this),1000)
			},
			modifyPwd(){//提交更改密码
				if(!this.oldPassword) return uni.showToast({ title: '请输入旧密码', icon: 'none' });
				else if(!this.newPassword)  return uni.showToast({ title: '请输入新密码', icon: 'none' });
				var that = this
				uni.showModal({
					title: '温馨提示',
					content: '是否确定修改密码？',
					cancelText: "取消", // 取消按钮的文字  
					confirmText: "确认", // 确认按钮的文字  
					showCancel: true, // 是否显示取消按钮，默认为 true
					success: function(res) {
						if (res.confirm) {
							console.log('用户点击确定');
							uni.showLoading({
								title:'加载中'
							})
							uni.request({
								url:that.$Env.getDevBaseURL() + '/system/user/profile/updatePwd',
								method:'put',
								data: {
									oldPassword:that.oldPassword,
									newPassword:that.newPassword,
								},
								header: {
									'Authorization':"Bearer "+ uni.getStorageSync("token"),
									'content-type': "application/x-www-form-urlencoded", // 默认值，另一种是"content-type" : "application/x-www-form-urlencoded"
								},
								success(res) {
									console.log(res.data)
									if(res.data.code == 200){
										uni.clearStorageSync();
										uni.showToast({ title:'修改成功', icon: 'none' });
										setTimeout(function(){
											uni.hideLoading()
											uni.reLaunch({
												url:'../index/login'
											})
										},1000)
									}else{
										uni.hideLoading()
										uni.showToast({ title:res.data.msg, icon: 'none' });
									}
								}
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},
		},
		onLoad(){
			
		},
		onShow() {
			
		}
	}
</script>

<style lang="scss">
	page {
		width: 100%;
		margin: 0;
		padding: 0;
		background-color: #F7F7F7;
	}
	.name{
		margin-top: 2rpx;
		display: flex; 
		background: #FFFFFF; 
		padding: 20rpx 35rpx; 
		font-size: 28rpx;
		color: #333333;
		.name_left{
			width: 120rpx;
		}
		.name_right{
			width: calc(100% - 120rpx);
			// color: #A49E9E;
		}
	}
	.loginButton-2{
	 width: 90%;
	 margin:0 5%;
	  height: 80rpx;
	position: fixed;
	bottom: 100rpx;
	  line-height: 80rpx;
	  border-radius: 10rpx;
	 color: #FFFFFF;
	 background-color: #796AD2;
	}
</style>
